<script>
export default {
  name: "Index",
  methods:{
    //跳转页面的方法
    toPage1(){
      //路由跳转page1
      this.$router.push({path:'/page1',query:{username:'李四'}})
    },
    toPage2(){
      //路由跳转page2
      this.$router.push({path:'/page2'})
    },
  }
}
</script>

<template>
  <div>
    <h1>Hello World!!!!!</h1>
    <!--    超链接跳转到page1-->
    <router-link to="/page1?username=zhangsan">跳转到页面1</router-link>
    <br>
    <!--    通过代码做跳转-->
    <button @click="toPage1()">跳转到页面1</button>
    <br>
    <router-link to="/page2">跳转到页面2</router-link>
    <br>
    <button @click="toPage2">跳转到页面2</button>
    <!--    路由视图，用于挂载子页面-->
    <router-view/>
  </div>
</template>

<style scoped>

</style>